﻿<phone:PhoneApplicationPage
    x:Class="NiklasKarl.WarpCam.Pages.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">
    
    <shell:SystemTray.ProgressIndicator>
        <shell:ProgressIndicator IsIndeterminate="True" IsVisible="False"/>
    </shell:SystemTray.ProgressIndicator>

    <phone:PhoneApplicationPage.Resources>
        <Style x:Name="AppImageBorderStyle" TargetType="Border">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="BorderBrush" Value="{StaticResource AppForegroundBrush}"/>
            <Setter Property="BorderThickness" Value="1"/>
        </Style>
        
        <Style x:Name="AppImageBorderSelectedStyle" TargetType="Border" BasedOn="{StaticResource AppImageBorderStyle}">
            <Setter Property="BorderBrush" Value="{StaticResource AppAccentBrush1}"/>
        </Style>

        <Style x:Key="AppImageTextStyle" TargetType="TextBlock" BasedOn="{StaticResource PhoneTextNormalStyle}">
            <Setter Property="Foreground" Value="{StaticResource AppForegroundBrush}"/>
            <Setter Property="HorizontalAlignment" Value="Right"/>
            <Setter Property="VerticalAlignment" Value="Bottom"/>
            <Setter Property="Margin" Value="3"/>
        </Style>
    </phone:PhoneApplicationPage.Resources>
    
    <!--LayoutRoot is the root grid where all page content is placed-->
    <DrawingSurfaceBackgroundGrid x:Name="LayoutRoot"
                                  Loaded="LayoutRoot_Loaded">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <!--Contains the icon and name of the application-->
            <Border Background="{StaticResource AppAccentBrush1}">
                <StackPanel Margin="12,0,0,0" Orientation="Horizontal">
                    <Image Source="/Assets/ApplicationIcon (32x32).png" Width="32" Height="32" Margin="12,0"/>
                    <TextBlock Text="WARP CAM" Style="{StaticResource PhoneTextNormalStyle}" Margin="0,17,0,16" Foreground="{StaticResource AppForegroundBrush}"/>
                </StackPanel>
            </Border>
        
            <!-- Contains the native interop with renders the viewfinder -->
            <Border Grid.Row="1" Margin="24,0,24,0" Height="576"
                    toolkit:TiltEffect.IsTiltEnabled="True">
                <Grid x:Name="ViewfinderPanel" Grid.Row="1"
                      Background="Transparent"
                      ManipulationStarted="ViewfinderPanel_ManipulationStarted"
                      ManipulationDelta="ViewfinderPanel_ManipulationDelta"
                      ManipulationCompleted="ViewfinderPanel_ManipulationCompleted">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>

                    <Border Grid.Column="0" Grid.Row="0" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="SmallNose" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="1" Grid.Row="0" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="Upnose" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="2" Grid.Row="0" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="BigNose" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="0" Grid.Row="1" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="Alien" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="1" Grid.Row="1" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="Normal" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="2" Grid.Row="1" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="WideSmile" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="0" Grid.Row="2" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="Square" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="1" Grid.Row="2" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="Twister" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                    <Border Grid.Column="2" Grid.Row="2" Style="{StaticResource AppImageBorderStyle}">
                        <TextBlock Text="Grit" Style="{StaticResource AppImageTextStyle}"/>
                    </Border>
                </Grid>
            </Border>
        </Grid>
    </DrawingSurfaceBackgroundGrid>
    
    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar BackgroundColor="{StaticResource AppAccentColor1}">
            <shell:ApplicationBar.Buttons>
            </shell:ApplicationBar.Buttons>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="about" Click="AboutButton_Click"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>